<template>
  <div>
    <h1>移除不需要被视监的up主</h1>
    <input 
      v-model="uidToRemove" 
      type="number" 
      placeholder="Enter UID to remove" 
      class="custom-input"
    />
    <button @click="removeUid" class="custom-button">Remove UID</button>
  </div>
</template>

<script>
import fs from 'fs';
import path from 'path';

export default {
  data() {
    return {
      uidToRemove: null
    };
  },
  methods: {
    async removeUid() {
      if (this.uidToRemove) {
        const uidPath = path.resolve(__dirname, '../../data/uid.json');
        const jsonData = JSON.parse(fs.readFileSync(uidPath, 'utf8'));
        const updatedUids = jsonData.uids.filter(uid => uid !== this.uidToRemove);
        fs.writeFileSync(uidPath, JSON.stringify({ uids: updatedUids }, null, 2), 'utf8');
        this.uidToRemove = null;
      }
    }
  }
};
</script>

<style scoped>
.custom-input {
  width: 100px;
  height: 100px;
}

.custom-button {
  height: 40px;
}
</style>